<template>
    <div class="wrapper">
        <mt-header :fixed="false" title="系统设置" mtClass="no-bg" leftPath="/account"/>
        <div class="list">
            <mt-cell title="登入密码" is-link @click.native="toEditLoginPwd">
                <span>{{userInfo.loginPassword=='0'?'已设置':'未设置'}}</span>
            </mt-cell>
            <mt-cell title="支付密码" is-link @click.native="toEditPayPwd"> 
                <span>{{userInfo.payPassword=='0'?'已设置':'未设置'}}</span>
            </mt-cell>
            <mt-cell title="手机" is-link  class="no-border" @click.native="toEditPhone">
                <span>{{userInfo.mobile}}</span>
            </mt-cell>
        </div>
        <div class="blank-9"></div>
        <div class="list">
            <mt-cell title="关于我们" is-link  @click.native="toAboutDLB"></mt-cell>
            <!-- <mt-cell title="帮助中心" is-link  class="no-border" @click.native="$router.push('/account/setting/help')"></mt-cell> -->
        </div>
        <div class="blank-9"></div>
        <div class="list">
            <mt-cell title="意见反馈" is-link  @click.native="$router.push('/account/setting/feedback')"></mt-cell>
            <mt-cell :title="`当前版本 ${versionName}`" class="no-border">
            </mt-cell>
        </div>
        <div class="default-btn botBtn">
            <mt-button type="primary" size="large" @click.native="logout">退出登录</mt-button>
        </div>
    </div>
</template>

<script>
import { mapActions } from 'vuex'
import mtHeader from "@/components/Header"
import { MessageBox, Toast } from 'mint-ui';
import cache from '@/utils/cache'
export default {
    data() {
        return {
            versionName : '',
            userInfo: {}
        };
    },
    components:{
        mtHeader
    },
    activated(){
        this.init();
    },
    methods: {
        ...mapActions('user', [
            'get_userInfo_cache',
            'get_userInfo_data'
        ]),
        ...mapActions('app', [
            'get_version_data'
        ]),
        init(){
            this.get_version_data().then(res => {
                this.versionName = res;
            })
            // 用户信息的缓存？缓存 : 发送请求
            this.get_userInfo_cache()
            .then(res => {
                if (res) {
                    this.userInfo = res
                } else {
                    this.get_userInfo_data().then(res => {
                        this.userInfo = res
                    })
                }
            })
        },
        toEditLoginPwd(){
            this.$router.push({
                path:'/account/setting/editLoginPwd',
                query:{ 
                    loginPassword:this.userInfo.loginPassword
                }
            })
        },
        toEditPayPwd(){
            this.$router.push({
                path:'/account/setting/editPayPwd',
                query:{ 
                    payPassword:this.userInfo.payPassword,
                    loginPassword:this.userInfo.loginPassword,
                    mobile:this.userInfo.mobile
                }
            })
        },
        toEditPhone(){
            this.$router.push({
                path:'/account/setting/editPhone',
                query:{ 
                    mobile:this.userInfo.mobile,
                    loginPassword:this.userInfo.loginPassword
                }
            })
        },
        toAboutDLB(){
            this.$router.push('/account/setting/about')
        },
        logout(){
            MessageBox({
                title:'',
                message: '退出后将无法获得RB奖励，是否仍要退出？',
                closeOnClickModal:true,
                showCancelButton:true,
            }).then(action => {
                if (action == 'confirm') {
                    cache.removeSession()
                    cache.removeLocal()
                    this.$router.push('/login')
                }else{
                    console.log('取消的回调'); 
                }
            });
        }
    }
};
</script>

<style lang="stylus" scoped>
.wrapper{
    .botBtn{
        position:absolute;
        bottom:3%;
        width:100%;
    }
}
</style>